import React, { Component } from 'react'
import { AtList, AtListItem,AtAvatar,AtDivider  } from "taro-ui"
import { View } from '@tarojs/components'

import "./DoctorThing.scss"

class DoctorThing extends Component {

  constructor(){
    super(...arguments)
    this.state = {
      data:this.props.data,
      // note_status:false
    }
  }

  // clickNote = () =>{
  //   this.setState({note_status:!this.state.note_status})
  // }

  render () {
    
    return (
      <AtList hasBorder={false}>
        <View>
          <View  className='picture'>
            <AtAvatar image={this.state.data.picture} circle></AtAvatar>
          </View>
          <AtListItem note={this.state.data.hospital_name+' '+this.state.data.department}
            title={this.state.data.doctor_name+' '+this.state.data.name_level} 
            hasBorder={false} className='doctor_things'/>
          <AtDivider height='10' lineColor='#ffffff'/>
        </View>
        <AtListItem title={'患者满意度：'+this.state.data.satis_rate+'%'} hasBorder={false}
                    extraText={'挂号量:'+this.state.data.order_count}/>
        {/* <AtListItem hasBorder={false} extraText={this.state.note_status?'收起':'展开'} onClick={this.clickNote}
                    note={this.state.note_status?this.state.data.introduction:this.state.data.introduction.slice(0,38).concat('...')}/> */}
         <AtListItem hasBorder={false} note={'简介：'+this.state.data.introduction}/>           
      </AtList>
    )
  }
}

export {DoctorThing}